import 'package:bilibili/model/home_mo.dart';
import 'package:bilibili/navigator/hi_navigator.dart';
import 'package:bilibili/util/format_util.dart';
import 'package:bilibili/util/view_util.dart';
import 'package:flutter/material.dart';
import 'package:transparent_image/transparent_image.dart';

class VideoCard extends StatelessWidget {
  final VideoMo? vidoeMo;

  const VideoCard({Key? key, required this.vidoeMo}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return InkWell(
        onTap: () {
          HiNavigator.getInstance()
              .onJumpTo(RouteStatus.detail, args: {"videoMo": vidoeMo});
        },
        child: SizedBox(
          height: 185,
          child: Card(
            // 取消卡片默认边距
            margin: EdgeInsets.only(left: 4, right: 4, bottom: 8, top: 8),
            child: ClipRRect(
              borderRadius: BorderRadius.circular(5),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  _itemImage(context),
                  _infoText(),
                ],
              ),
            ),
          ),
        ));
  }

  _infoText() {
    return Expanded(
        child: Container(
            padding: EdgeInsets.only(top: 5, left: 8, bottom: 4),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Text(
                  vidoeMo?.title ?? "",
                  style: TextStyle(fontSize: 12, color: Colors.black87),
                  maxLines: 2,
                  overflow: TextOverflow.ellipsis,
                ),
                _owner()
              ],
            )));
  }

  _owner() {
    var owner = vidoeMo?.owner;
    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Row(
          children: [
            ClipRRect(
              borderRadius: BorderRadius.circular(12),
              child: cachedImage(owner?.face ?? "", width: 24, height: 24),
              // Image.network(
              //   owner?.face ?? "",
              //   width: 24,
              //   height: 24,
              // ),
            ),
            Padding(
              padding: EdgeInsets.only(left: 8),
              child: Text(
                owner?.name ?? "",
                style: TextStyle(fontSize: 11, color: Colors.black87),
              ),
            ),
          ],
        ),
        Padding(
          padding: EdgeInsets.only(right: 4),
          child: Icon(
            Icons.more_vert_sharp,
            size: 15,
            color: Colors.grey,
          ),
        )
      ],
    );
  }

  _itemImage(BuildContext context) {
    final size = MediaQuery.of(context).size;
    return Stack(
      children: [
        // FadeInImage.memoryNetwork(
        //     width: size.width / 2 - 20,
        //     fit: BoxFit.cover,
        //     placeholder: kTransparentImage,
        //     image: vidoeMo?.cover ?? ""),
        // Image.network(
        //   vidoeMo?.cover ?? "",
        //   width: size.width / 2 - 20,
        // ),
        cachedImage(vidoeMo?.cover ?? "",
            width: size.width / 2 - 18, height: 100),
        Positioned(
          left: 0,
          right: 0,
          bottom: 0,
          child: Container(
            padding: EdgeInsets.fromLTRB(8, 5, 8, 3),
            decoration: BoxDecoration(
                gradient: LinearGradient(
                    begin: Alignment.bottomCenter,
                    end: Alignment.topCenter,
                    colors: [Colors.black54, Colors.transparent])),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                _iconText(Icons.ondemand_video, vidoeMo?.view ?? 0),
                _iconText(Icons.favorite_border, vidoeMo?.favorite ?? 0),
                _iconText(null, vidoeMo?.duration ?? 0)
              ],
            ),
          ),
        )
      ],
    );
  }

  _iconText(IconData? iconData, int count) {
    String views = "";
    if (iconData != null) {
      views = countFormat(count);
    } else {
      views = durationTransform(vidoeMo?.duration ?? 0);
    }

    return Row(
      children: [
        if (iconData != null) Icon(iconData, color: Colors.white, size: 12),
        Padding(
            padding: EdgeInsets.only(left: 3),
            child: Text(
              views,
              style: TextStyle(color: Colors.white, fontSize: 10),
            ))
      ],
    );
  }
}
